<html> 
<head> 
<title>Options - Hyves Chrome Photo Uploader</title> 
<link href="css/main.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="js/sha1.js"></script>
<script type="text/javascript" src="js/hyves.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/footer.js"></script>
<script type="text/javascript">

var refreshcontextmenu = function () {
		chrome.extension.connect().postMessage({
			"name": "refresh_contextmenu"
		});
}

var doApiCalls = function () {
	hyves.call('users.getLoggedin', {'ha_responsefields': 'profilepicture'}, function(responseUser) {
		hyves.call('albums.getByUser', {'userid': responseUser.get('user', 0, 'userid'),'ha_resultsperpage': 100}, function(responseAlbums) {
			var html = '';
			for(i = 0; i < responseAlbums.countResults('album'); i++) {
				var album = responseAlbums.get('album')[i];
				var isDefaultAlbum = localStorage["hyves_default_albumid"] == album.albumid;
				html += '<option value="' + album.albumid + '" ' + (isDefaultAlbum ? 'selected="selected"' : '') + '>' + album.title + ' (' + albumnames[album.visibility] +')' + '</option>';
			}
            localStorage["hyves_albums"] = JSON.stringify(responseAlbums._response);
			refreshcontextmenu();
			$('#select_album').append(html);
   			var isContextmenu = localStorage["hyves_setting_contextmenu"];
            if(isContextmenu != 1 || isContextmenu != 0) isContextmenu = localStorage["hyves_setting_contextmenu"] = 1;
			isContextmenu ? $('#setcontext').attr('checked', true) : $('#setcontext').attr('checked', false);
			$('#photoHyver').append('<img src="'+responseUser.get('user')[0].profilepicture.square_large.src+'">');
			$('#linkHyver').append('<a href="'+responseUser.get('user')[0].url+'" target="_blank">'+responseUser.get('user')[0].firstname+' '+responseUser.get('user')[0].lastname+'</a>');
			$('#deauthorizeButton').text('Deautoriseren');
			$('#deauthorizeButton').click(deauthorize);
		});
	});
};

var authorize = function () {
	hyves.requestAuthorizationRedirect(
		chrome.extension.getURL('options.html'), methods, 'infinite',
		function() {
			hyves.saveToken();
			window.location.href = chrome.extension.getURL('options.html');
		},
		function(e) {
			alert(e.message);
			window.location.href = chrome.extension.getURL('options.html');
		}
	);
};

var deauthorize = function () {
	hyves.call('auth.revokeSelf', function(response) {
		$('#photoHyver').text('');
		$('#linkHyver').text('');
		$('#deauthorizeButton').text('Autoriseren');
		$('#deauthorizeButton').click(authorize);
		$('#select_album').html('<option value="0">None</option>');
		hyves.clearToken();
		localStorage.clear();
		refreshcontextmenu();
	});	
}
$(document).ready(function() {
	$('#footercontent').append(share_content);
	$('#page').show();
	
	hyves =  new Hyves(hyves_api_key, hyves_api_secret);
	// check if redirected and finalize authorisation
	if (hyves.getQueryParamValue('oauth_token') != null) {
		authorize();
	}

	hyves.restoreToken(methods, 'users.getLoggedin',
		function() {
			doApiCalls();
		}, 
		function() {
			$('#currentHyver').text('none');
			$('#deauthorizeButton').text('Autoriseren');
			$('#deauthorizeButton').click(authorize);
		}
	);
	
	$('#select_album').change(function () {
		localStorage["hyves_default_albumid"] = $('#select_album').val();
		refreshcontextmenu();
	});

	$('#setcontext').change(function () {
        if($('#setcontext:checked').val() == 'on') localStorage["hyves_setting_contextmenu"] = 1; else localStorage["hyves_setting_contextmenu"] = 0; 
		refreshcontextmenu();
	});
});
</script>
<body>
<div id="canvas_wrapper"></div>
	<div id="page">
		<div id="page-hdr"><div class="donate"><a href="javascript:window.open('http://www.hyves-share.nl/button/pay/?member_id=770379','paywindow','toolbar=0,status=0,width=600,height=500,scrollbars=yes');" target="_blank">Doneer hier met Hyves!</a></div></div>
		<div id="page-con">
			<div id="page-con-hdr">
				<div class="box">
					<div id="page-con-info"><div class="bottom-inline-block"><h1>Chrome Foto Uploader</h1></div></div>
					<div class="box-con-bg"></div>
				</div>
				<div class="border"></div>
				<div class="bg"></div>
			</div>
			<div id="page-con-body">
				<div class="line wrapper w4">
					<div class="unit s1">
						<div class="box">
							<div class="box-hdr"><div class="box-hdr-bg">&nbsp;</div><div class="box-hdr-inner"><h2>Opties</h2></div></div>
							<div class="box-con"><div class="box-con-bg">&nbsp;</div>
								<div class="box-con-inner">
									<div class="line">
										<div class="unit p30"><div class="unit-bd">Huidige gauthoriseerde Hyver:</div></div>
										<div class="unit p10"><div class="unit-bd"><div id="photoHyver"></div></div></div>
										<div class="unit p20"><div class="unit-bd"><div id="linkHyver"></div></div></div>
										<div class="unit p40"><div class="unit-bd">
											<button type="submit" id="deauthorizeButton">Loading...</button>
										</div></div>
									</div>
									<div class="line">
										<div class="unit p30"><div class="unit-bd">Tonen in ContextMenu (rechtermuisknop menu):</div></div>
										<div class="unit p20"><div class="unit-bd"><INPUT TYPE="checkbox" id="setcontext" checked></div></div>
										<div class="unit p50"><div class="unit-bd">
										</div></div>
									</div>
									<div class="line">
											<div class="unit p30"><div class="unit-bd">Default album:</div></div>
											<div class="unit p70"><div class="unit-bd">
											<select id="select_album">
												<option value="0">None</option>
											</select>
											</div></div>
									</div>
								</div>
							</div>
						</div>
					</div>          
					<div class="unit s1">
						<div class="box">
							<div class="box-hdr"><div class="box-hdr-bg">&nbsp;</div><div class="box-hdr-inner"><h2>Versie geschiedenis</h2></div></div>
							<div class="box-con"><div class="box-con-bg">&nbsp;</div>
								<div class="box-con-inner">
									<div class="line">
										<div id="versions">
											<h3>Versie 1.5</h3>
											<ul>
												<li>Upload direct vanuit het contextmenu (rechtermuisknop menu) naar albums</li>
												<li>Setting om het contextmenu wel of niet te tonen</li>
												<li>Deze Chrome extensie delen op sociale media</li>
											</ul>
											<h3>Versie 1.4</h3>
											<ul>
												<li>Design toegevoegd aan de Options en Target pagina's</li>
											</ul>
											<h3>Versie 1.3</h3>
											<ul>
												<li>Default album selectie toegevoegd aan de options pagina</li>
											</ul>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="border"></div>
				<div class="bg"></div>			
			</div>
			<div id="page-con-ftr">
				<div class="border"></div>
				<div class="bg"></div>		
			</div>
		</div>
		<div id="page-ftr">
			<div id="footercontent"></div>
		</div>
	</div>
</body>
</html>